<template>
	<view class="content">
		<view class="background padding-top-01">
			<view class="status_bar"></view>
			<view class="padding-about-30">
				<view class="  ">
					<uv-swiper keyName="show_image" :list="index.banner" radius="15" height="385rpx"></uv-swiper>
				</view>
				<view class=" margin-top-20">
					<uv-notice-bar @click="(e)=> navigateTo('/pages/show/Notice')" bgColor="rgba(0,0,0,0)" color="#FFFFFF" :text="text"
						direction="column"></uv-notice-bar>
				</view>
			</view>
		</view>
		<view class="padding-about-30">
			<view class="display-flex space-between align-items margin-top-20">
				<scroll-view class="scroll-view_H" scroll-x="true" @scroll="scroll" scroll-left="120">
					<image @click="navigateTo('/pages/show/InformationDetails?id=' + item.id)" v-for="item,index in index.show_active" :key="index" :src="item.show_image"
						style="width: 330rpx;height: 216rpx;" class="border-radius-12 margin-right-20" mode="aspectFill"></image>
				</scroll-view>

				<!-- <image src="/static/logo.png" style="width: 330rpx;height: 216rpx;" class="border-radius-12" mode="aspectFill"></image> -->
			</view>
			<view v-if="index.video" class="margin-top-20">
				<video style="height: 388rpx;width: 690rpx;border-radius: 20rpx;" :src="index.video"></video>
			</view>
			<view class="margin-top-20">
				<view class="display-flex align-items">
					<image src="/static/diandian.png" style="width: 40rpx;height: 40rpx;" mode="widthFix"></image>
					<view class="font-size-30 margin-left-20 font-weight-bold">
						热门活动
					</view>
				</view>
				<view class="">

					<view class="view display-flex margin-top-20" @click="navigateTo('/pages/show/InformationDetails?id=' + item.id)" v-for="item,index in index.list_active" :key="index">
						<image :src="item.show_image" style="width: 189rpx;height: 152rpx;" class="border-radius-12"
							mode="aspectFill"></image>
						<view class="margin-left-20 file-1">
							<view class="">
								<view class="font-size-28 webkit-line-clamp" style="-webkit-line-clamp: 1;">
									{{item.title}}
								</view>
								<view class=" font-size-26 color-999 webkit-line-clamp" style="-webkit-line-clamp: 2;">
									{{item.introduce}}
								</view>
							</view>
							<view class="text-right font-size-24 color-999 margin-top-10">
								{{item.createtime}}
							</view>
						</view>
					</view>
					<view class="kong">

					</view>
				</view>
			</view>
		</view>
		<div class="kong"></div>
		<div class="kong"></div>
		
		<m-tabbar :current="0"></m-tabbar>
	</view>
</template>

<script setup>
	import {
		ref,
		reactive
	} from 'vue';
	import {
		onLoad,
		onShow,
		onReady,
		onReachBottom
	} from '@dcloudio/uni-app';
	import {
		nativeUI,
		navigateTo,
		navigateBack
	} from '@/utils/index.js';
	import * as api from '@/request/app.js'; // 引入api 方法
	import local from '@/utils/localStorage.js'; //引入本地存储方法
	const swiperlist = ref([
		'https://cdn.uviewui.com/uview/swiper/swiper1.png',
		'https://cdn.uviewui.com/uview/swiper/swiper2.png',
		'https://cdn.uviewui.com/uview/swiper/swiper3.png',
	])
	const text = ref(['uv-ui众多组件覆盖开发过程的各个需求', '组件功能丰富，多端兼容', '让您快速集成，开箱即用'])
	const index = ref({})
	
	onLoad(function(option) {
		
		
		
	});
	onShow(function() {
		getHomeindex()
	});
	
	async function getHomeindex() {
		const {
			code,
			data
		} = await api.getHomeindex()
		if (code == 1) {
			index.value = data
			text.value = data.gonggao.map(item => {
				return item.title
			})
		}
	}
	onReady(function() {
		
		
	});
	onReachBottom(function() {});
</script>

<style scoped lang="scss">
	::v-deep .uv-modal__content__text{
		text-align: center !important;
	}
	.view {
		padding: 15rpx;
		background: #FFFFFF;
		border-radius: 20rpx;
	}

	.scroll-view_H {
		white-space: nowrap;
		width: 100%;
	}

	.background {
		width: 750rpx;
		height: 570rpx;
		background: linear-gradient(180deg, #2671CE 0%, #7CB5FD 100%);
	}
</style>